<html>
    <head>
        <title>Download Chromium</title>
        <meta name="description" content="The easiest way to download Chromium">
        <meta name="keywords" content="chromium,download,chrome,build,snapshot,francois,beaufort">
        <meta name="google-site-verification" content="OWR3-zSQgPnnXh6Ny_m_-80tlE_db9z8NXqhHJ03saM" />
        <link rel="canonical" href="http://download-chromium.appspot.com" />

        <link rel="icon" type="image/png" href="/favicon.ico">
        <link href='//fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

        {% if platform %}
        <link rel="prerender" href="/dl/{{ platform.name }}">
        {% endif %}

        <style type='text/css'>
            body {
                font-family: 'Open Sans', sans-serif;
                color: #777;
                margin: 0 auto;
                cursor: default;
                text-align: center;
                font-size: 18px;
                background: #474747 url('');
            }

            a {
                text-decoration: none;
                color: #888;
                text-shadow: 0 1px #333;
            }

            a:hover {
                color: #6792cc;
            }

            #blah {
                line-height: 30px;
                margin-top: 128px;
                padding: 0 64px;
            }

            .canary:hover {
                color: #e6c11e;
            }

            .button {
                font-size: 22px;
                background-color: rgba(0,0,0,.3);
                width: 224px;
                margin: 0 auto;
                padding: 8px;
                border-radius: 4px;
                box-shadow: inset 0 2px 2px #111;
                padding-left: 128px;
                border-bottom: 1px solid #666;
                position: relative;
                overflow: hidden;
                cursor: pointer;
                margin-top: 64px;
            }

            .button img {
                position: absolute;
                top: -39px;
                left: 0;
                -webkit-mask-box-image: -webkit-linear-gradient(transparent 32%, black 78%);
            }

            @-webkit-keyframes woohoo {
              0%, 100% { opacity: .5; }
              50%      { opacity: 1;  }
            }

            .button span {
                -webkit-animation: woohoo 2s infinite;
            }

            .button span:nth-child(2) {
                color: #6792cc;
            }

            .rotate {
                -webkit-transform: rotate(360deg);
                   -moz-transform: rotate(360deg);
                    -ms-transform: rotate(360deg);
                     -o-transform: rotate(360deg);
                        transform: rotate(360deg);

                -webkit-transition: all 0.6s ease-out;
                   -moz-transition: all 0.6s ease-out;
                    -ms-transition: all 0.6s ease-out;
                     -o-transition: all 0.6s ease-out;
                        transition: all 0.6s ease-out;
            }

            #social {
                margin-top: 60px;
                opacity: 0;
            }

            #social.displayed {
                opacity: 1;
                -webkit-transition: all 0.8s ease-out;
                   -moz-transition: all 0.8s ease-out;
                    -ms-transition: all 0.8s ease-out;
                     -o-transition: all 0.8s ease-out;
                        transition: all 0.8s ease-out;
            }

            #sorry {
                margin-top: 64px;
                color: #9ACD32;
            }

            .credits {
                font-size: 70%;
                opacity: 0.6;
            }

            .all-platforms {
                background: rgba(0, 0, 0, 0.4);
                bottom: 0;
                position: fixed;
                width: 100%;
                line-height: 36px;
            }

             .all-platforms a {
                font-size: 65%;
                padding: 0px 4px;
            }
        </style>
        <script type="text/javascript">
          var _gaq = _gaq || [];
          _gaq.push(['_setAccount', 'UA-17064752-3']);
          _gaq.push(['_trackPageview']);

          (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
          })();
        </script>
    </head>
    <body>
        {% if platform %}
        <p id="blah">
          This is the raw build of {{ platform.pretty_name }}, right off the trunk. It may be tremendously buggy.<br/>
          Consider <a class="canary" href="https://www.google.com/intl/en/chrome/browser/canary.html">Chrome Canary</a> or <a href="http://www.chromium.org/getting-involved/dev-channel">Dev Channel</a> for a build that regularly auto-updates to latest. </p>
        <div class="button">
          <a id="download" download="chromium.zip" href="/dl/{{ platform.name }}">
            <span>download</span><span>chromium</span>
          </a>
          <img id="logo" src="/img/logo.png" width="128px" height="128px"/>
        </div>
        {% else %}
        <p id="sorry">Sorry... Chromium doesn't exist yet for your platform.</p>
        {% endif %}
        <p class="credits">
          <span>created by <a href="https://plus.google.com/100132233764003563318" rel="me">François Beaufort</a></span> - 
          <span>now maintained by the <a href="http://www.chromium.org">Chromium team</a></span>
        </p>
        <div class="all-platforms">
        {% for platform in platforms %}
          <a href="?platform={{ platform }}">{{ platform.pretty_name }}</a>
        {% endfor %}
        </div>
        {% if platform %}
        <div id="social"><g:plusone size="tall" annotation="inline"></g:plusone></div>
    <script type="text/javascript">
        var download = document.getElementById('download');
        download.addEventListener('click', function() {
            _gaq.push(['_trackPageview', this.pathname]);
            // Google +1 stuff
            (function() {
                var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
                po.src = 'https://apis.google.com/js/plusone.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
            })();

            var logo = document.getElementById('logo');
            logo.classList.add('rotate');
            setTimeout(function() { logo.classList.remove('rotate'); }, 600);

            var social  = document.getElementById('social');
            social.classList.add('displayed');
        });
    </script>
        {% endif %}
    </body>
</html>
